<template>
  <div class="flex w-100% justify-center" v-if="column.editx && isHave && field">
    <!-- v-if="record[showkey]"  -->
    <div class="text-center w-100% flex">
      <!-- <a-tooltip placement="top">
        <template #title>
          {{ textShow(record.assessUserName) || '--' }}
        </template>
<span class="text-span" v-if="field == 'assessUserName'">{{ textShow(record.assessUserName) || '--' }}</span>
</a-tooltip> -->
      <!-- isAssess ? filterOptions : props.options -->
      <CommonSelect v-if="[0, 1, 2].includes(status) && field == 'assessUserName'"
        @confirm="(val) => { record[field] = val; doConfirm(val, record[field]) }" :value="record[field]"
        :placeholder="placeholder" @open="open" :mode="mode" v-auth="'setAssessUser'" :options="isAssess ? filterOptions : props.options"></CommonSelect>
      <CommonSelect v-else-if="[0, 1].includes(status) && field == 'questions'"
        @confirm="(val) => { record[field] = val; doConfirm(val, record[field]) }" :value="record[field]"
        :placeholder="placeholder" :mode="mode" v-auth="'setGroup'" :options="isAssess ? filterOptions : props.options"></CommonSelect>
      <CommonSelect v-else-if="[0, 1].includes(status) && field == 'group'"
        @confirm="(val) => { record[field] = val; doConfirm(val, record[field]) }" :value="record[field]"
        :placeholder="placeholder" :mode="mode" v-auth="'setGroup'" :options="isAssess ? filterOptions : props.options"></CommonSelect>
      <div class="text-center w-100%" v-else>{{ record[field] || "--" }}</div>
      <!-- <template v-if="[0,1,2].includes(status) && field == 'assessUserName'">
         <form-outlined v-auth="'setAssessUser'" class="ml-8px cursor-pointer" @click="changeStatus(record)"/>
       </template>
       <template v-if="[0,1].includes(status) && field == 'questions'">
         <form-outlined v-auth="'setGroup'" class="ml-8px cursor-pointer" @click="changeStatus(record)"/>
       </template>
       <template  v-if="[0,1].includes(status) &&  field == 'group'">
         <form-outlined v-auth="'setGroup'" class="ml-8px cursor-pointer" @click="changeStatus(record)"/>
       </template> -->
    </div>
    <!-- <template v-else>
      <a-select v-model:value="selectVal" class="flex-1" :placeholder="placeholder" show-search
        :filter-option="filterOptionMethod" :options="isAssess ? filterOptions : props.options" :mode="mode" />
      <div class="ml-10px mt-5px">
        <check-outlined class="mr-5px cursor-pointer" @click="confirmClick" />
        <close-outlined class="cursor-pointer" @click="changeStatus(record)" />
      </div>
    </template> -->
  </div>
</template>

<script lang="ts" setup>
import { watchEffect, ref, computed } from '@vue/runtime-core'
import { batchUpdateAssessmentUser, batchUpdateGroup } from '@/api/train/detail.ts'
import { selectUserByRole } from '@/api/applay/trainlist/self'
import { useRoute } from "vue-router"
import { message } from 'ant-design-vue'
import CommonSelect from '../../components/CommonSelect.vue'
const props = defineProps({
  record: {
    type: Object,
    default: () => {
      return {}
    },
  },
  column: {
    type: Object,
    default: () => {
      return {}
    },
  },
  options: {
    type: Array,
    default: () => {
      return []
    },
  },
  placeholder: {
    type: String,
    default: '请选择'
  },
  mode: {
    type: String,
    default: ''
  },
  field: {
    type: String,
    default: ''
  },
  data: {
    type: Object,
    default: () => {
      return {}
    },
  },
})
const showkey = computed(() => {
  return `${props.field}Show`
})

const status = computed(() => {
  return props.data.status
})
// 对象中是否包含这个值
const isHave = computed(() => {
  return props.record.hasOwnProperty(showkey.value)
})

const doConfirm = (val, record) => {
  // console.log(filterOptions.value)
  console.log(val)
  confirmClick(val)
}

const selectVal = ref()
// 是否是考核官
const isAssess = computed(() => {
  return props.field == 'assessUserName'
})

// 是否是小组
const isGroup = computed(() => {
  return props.field == 'group'
})

const route = useRoute()
const emit = defineEmits(['success'])
const trainingNumberId = route.query.trainingNumberId
// 确认提交
async function confirmClick(val) {
  // if (!val?.length) {
  //   message.error('请选择')
  //   return
  // }
  let res = {} as any
  if (isAssess.value) {
    const ids: any = [];
    // filterOptions.value
    val.forEach(el => {
      props.options.forEach((item: any) => {
        if (el === item.label) {
          ids.push(item.value)
        }
      })
    })
    console.log(ids)
    let params = {
      assessUserIds: ids, // 考核官ids
      resumesIds: [props.record.resumesId],   // 简历id
      trainingNumberId
    }
    res = await batchUpdateAssessmentUser(params)
  } else {
    let params = {
      group: val, // 小组
      questions: val,   // 选题
      resumesIds: [props.record.resumesId],   // 简历id
    }
    if (isGroup.value) {
      delete params.questions
    } else {
      delete params.group
    }
    res = await batchUpdateGroup(params)
  }
  if (res.code == '10000') {
    // switchFun()
    emit('success')
    message.success('修改成功')
  } else {
    message.error(res.msg)
  }
}

const open =(val)=>{
  console.log(val,'val')
  selectVal.value=val
}

const filterOptions = ref([])
watchEffect(() => {
  if (filterOptions.value.length == 0) {
    filterOptions.value = filterOptionsFun() as any
  }
})

// 过滤只减不增
function filterOptionsFun() {
  if (status.value == 2) {
    let list = props.options.filter((v: any) => {
      return selectVal.value?.includes(v.label)
    })
    return list
  } else {
    return props.options
  }
}
</script>

<style lang="less" scoped>
.text-span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
  flex: 1;
}
</style>